<template>
  <div>
    <fAce01 class="force01" :datas="data01"  v-if="data01.length"></fAce01>
    <fAce02 class="force02" :datad="data02"  v-if="data02.length"></fAce02>
    <fAce03 class="force03" :datam="data03"  v-if="data03.length"></fAce03>
    <fAce04 class="force04" :datal="data04"  v-if="data04.length"></fAce04>
    <fAce05 class="force05" :datak="data05"  v-if="data05.length"></fAce05>
    <fAce06 class="force06" :dataj="data06"  v-if="data06.length"></fAce06>
    <fAce07 class="force07" :datao="data07"  v-if="data07.length"></fAce07>
<!--    <cs class="force05" :datas="data01"  v-if="data01.length"></cs>-->
  </div>
</template>

<script>
  export default{
    data(){
      return{
        data01:[],//图表1数据
        data02:[],//图表2数据
        data03:[],//图表3数据
        data04:[],//图表4数据
        data05:[],//图表5数据
        data06:[],//图表6数据
        data07:[],//图表7数据
      }
    },
    components:{
      fAce01:()=>import("../components/force01"),
      fAce02:()=>import("../components/force02"),
      fAce03:()=>import("../components/force03"),
      fAce04:()=>import("../components/force04"),
      fAce05:()=>import("../components/force05"),
      fAce06:()=>import("../components/force06"),
      fAce07:()=>import("../components/force07"),
      cs:()=>import("../components/cs"),
    },
    beforeMount(){

    },
    created(){
      this.forCe()
    },
    methods:{
      forCe(){
        var that=this;
        that.$axios.get('../../static/apijson/force01.json').then((response) => {
          console.log(response)
          that.data01=response.data;
        });
        that.$axios.get('../../static/apijson/force02.json').then((response) => {
          console.log(response)
          that.data02=response.data;
        })
        that.$axios.get('../../static/apijson/force03.json').then((response) => {
          console.log(response)
          that.data03=response.data;
        })
        that.$axios.get('../../static/apijson/force04.json').then((response) => {
          console.log(response)
          that.data04=response.data;
        })
        that.$axios.get('../../static/apijson/force05.json').then((response) => {
          console.log(response)
          that.data05=response.data;
        })
        that.$axios.get('../../static/apijson/force06.json').then((response) => {
          console.log(response)
          that.data06=response.data;
        })
        that.$axios.get('../../static/apijson/force07.json').then((response) => {
          console.log(response)
          that.data07=response.data;
        })
      }
    }

  }
</script>

<style>
  html,body{
      -webkit-user-select:none;
      -moz-user-select:none;
      -ms-user-select:none;
      user-select:none;
   }
  .force01,.force02,.force03{
    float:left;width:100%;
  }
  
</style>
